<template>
  <div class="operate-form-modal">
    <Row>
      <Col :span="15">
        <h5 class="h5">日志清理</h5>
        <Button
          @click="handleOperate('清空日志', '清空本地系统日志', 4)"
          type="text"
          ><SvgIcon name="operate-icon2" class="svg" />清空系统日志</Button
        >
        <Button
          @click="handleOperate('清空日志', '清空本地预警日志', 6)"
          type="text"
          ><SvgIcon name="operate-icon3" class="svg" /> 清空预警日志</Button
        >
        <Button
          @click="handleOperate('清空日志', '清空本地速报日志', 5)"
          type="text"
          ><SvgIcon name="operate-icon4" class="svg" />清空速报日志</Button
        >
        <Button
          @click="handleOperate('清空日志', '清空本地气象预警', 9)"
          type="text"
          ><SvgIcon name="operate-icon5" class="svg" />清空气象预警</Button
        >
        <h5 class="h5">异常处理</h5>
        <Button @click="handleOperate('重启', '设备重启', 1)" type="text"
          ><SvgIcon name="operate-icon6" class="svg" />设备重启</Button
        >
        <Button @click="handleOperate('重启', 'APP重启', 2)" type="text"
          ><SvgIcon name="operate-icon7" class="svg" />程序重启</Button
        >
        <Button @click="handleOperate('重置', '设备重置', 7)" type="text"
          ><SvgIcon name="operate-icon10" class="svg" />设备重置</Button
        >
        <Button @click="handleOperate('重置', 'APP重置', 3)" type="text"
          ><SvgIcon name="operate-icon11" class="svg" />程序重置</Button
        >
        <h5 class="h5">同步与自检</h5>
        <Button @click="handleOperate('同步速报', '同步速报')" type="text"
          ><SvgIcon name="operate-icon1" class="svg" />同步速报</Button
        >
        <Button @click="handleOperate('设备自检', '设备自检')" type="text"
          ><SvgIcon name="operate-icon12" class="svg" />设备自检</Button
        >
        <h5 class="h5">屏幕录制</h5>
        <Button
          @click="handleOperate('屏幕录制', '开启屏幕录制', 10)"
          type="text"
          ><SvgIcon name="operate-icon8" class="svg" />开启屏幕录制</Button
        >
        <Button
          @click="handleOperate('屏幕录制', '关闭屏幕录制', 11)"
          type="text"
          ><SvgIcon name="operate-icon9" class="svg" />关闭屏幕录制</Button
        >
        <h5 class="h5">截图</h5>
        <Button @click="handleImg(1)" type="text"
          ><SvgIcon name="operate-icon14" class="svg" />实时普通截图</Button
        >
        <Button @click="handleImg(2)" type="text"
          ><SvgIcon name="operate-icon13" class="svg" />设备高清截图</Button
        >
      </Col>
      <Col :span="9" class="content-center">
        <div class="img" v-if="imgArr">
          <p>截图</p>
          <Image :width="300" :src="imgArr" />
        </div>
      </Col>
    </Row>
  </div>
</template>

<script setup lang="tsx">
import { ref } from 'vue';
import { Button, Col, Image, Modal, Row, message } from 'ant-design-vue';
import SvgIcon from '@/components/SvgIcons/Index.vue';
import { listToEnum } from '@/utils/utils';
import {
  deviceRestart,
  downloadScreenshotFile,
  synchronizeQuickReport,
  systemCheck,
} from '@/api/device';
import { getDictType } from '@/api/monitor';
import { saveRecord } from '@/api/notice';

const typeEnum: any = ref();
const dictInit = () => {
  getDictType('device_operate_type').then((res) => {
    typeEnum.value = listToEnum(res.data as any, 'dictLabel', 'dictCode');
  });
};

dictInit();

defineOptions({
  name: 'Operate',
});

interface Props {
  pageData: any;
  fastConfig?: boolean;
}
const props = defineProps<Props>();
const imgArr: any = ref('');
const handleOperate = (operateButton: string, name: string, id?: number) => {
  Modal.confirm({
    title: '系统提示',
    centered: true,
    content: `是否需要${name}`,
    onOk: async () => {
      let res: any;
      let params: any;
      if (id) {
        const deviceCodes = [props.pageData.code];
        const type = id;
        params = { deviceCodes, type };
        res = await deviceRestart(params);
        message.success(`${name}成功`);
      } else {
        if (name == '设备自检') {
          params = props.pageData.code;
          res = await systemCheck(props.pageData.code);
          message.success(`${name}成功`);
        } else {
          params = props.pageData.code;
          res = await synchronizeQuickReport(props.pageData.code, 10);
          const info = res.code == 200 ? `${name}成功` : `${name}失败`;
          message.success(info);
        }
      }

      let operateUri = id ? '/device/restart' : '/device/systemCheck';
      saveRecordFn(
        props.pageData,
        res,
        operateButton,
        JSON.stringify(params),
        operateUri,
      );
    },
  });
};
const saveRecordFn = async (
  item: any,
  res: any,
  operateButton: any,
  requestParam: any,
  operateUri: string,
) => {
  const list = [
    {
      deviceCode: item.code,
      operateModule: '设备管理/设备总览/快捷操作',
      requestParam,
      status: res.code == 200 ? 1 : 0,
      operateButton,
      operateType: typeEnum.value[operateButton],
      operateUri,
    },
  ];
  await saveRecord({ list });
};

const handleImg = async (type: any) => {
  const code = props.pageData.code;
  const res = await downloadScreenshotFile({ code, type });
  imgArr.value = 'data:image/png;base64,' + res.msg;
  saveRecordFn(
    props.pageData.code,
    res,
    '截图',
    JSON.stringify({ code, type }),
    '/file/downloadScreenshotFile1',
  );
};
</script>
